<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:ui="http://java.sun.com/jsf/facelets">


<ui:composition template="/templates/fornecedor.xhtml">

	<ui:define name="menu">
		<ui:include src="/fornecedor/menu.xhtml" />
	</ui:define>

	<ui:define name="conteudo">
		<div id="texto">

			<h2>Cadastro de Cliente</h2>
		</div>

		<h:form id="form">
			<p:growl id="growl" showDetail="false" />

			<h:inputHidden value="#{clienteBean.cliente.idCliente}" />
			<h:inputHidden value="#{clienteBean.endereco.idEndereco}" />

			<p:accordionPanel>
				<p:tab title="Dados do cliente">
					<p:fieldset>
						<div id="cadastro">
							<div style="padding-left: 30px; float: left; margin-top: 10px;">

								<p:panel id="pnlTipoPessoa">
									<h:outputText value="Tipo de pessoa: *"  style="font-weight:bold" />
									<p:selectOneRadio id="tipoPessoa"
										value="#{clienteBean.tipoPessoa}">
										<f:selectItem itemLabel="Pessoa Física " itemValue="0" />
										<f:selectItem itemLabel="Pessoa Jurídica " itemValue="1" />

										<p:ajax event="click" update="pnlCadastro"
											listener="#{clienteBean.selecionaTipoPessoa}" />
									</p:selectOneRadio>
								</p:panel>
								<br />


								<p:panel id="pnlCadastro">
									<h:panelGrid columns="2">
										<h:outputLabel value="Nome : * " for="nome"  style="font-weight:bold" />
										<h:panelGroup>
											<p:inputText id="nome" label="Nome"
												value="#{clienteBean.cliente.razaoSocial}" required="true"
												requiredMessage="Informe o seu nome" size="30"
												style="heght:30px;" />
											<span id="erro"> <h:message for="nome" /></span>
										</h:panelGroup>


										<h:outputLabel value="CPF : * " for="cnpj"  style="font-weight:bold"
											rendered="#{clienteBean.pessoaFisica}" />
										<h:panelGroup rendered="#{clienteBean.pessoaFisica}">
											<p:inputMask value="#{clienteBean.cliente.cnpj}" id="cpf"
												mask="999.999.999-99" required="true"
												requiredMessage="Informe um cpf válido">
											</p:inputMask>
											<span id="erro"> <h:message for="cpf" /></span>
										</h:panelGroup>




										<h:outputLabel value="CNPJ : * " for="cnpj"  style="font-weight:bold"
											rendered="#{clienteBean.pessoaJuridica}" />
										<h:panelGroup rendered="#{clienteBean.pessoaJuridica}">
											<p:inputMask value="#{clienteBean.cliente.cnpj}" id="cnpj"
												mask="99.999.999/9999-99" required="true"
												requiredMessage="Informe um cnpj válido válido">
											</p:inputMask>
											<span id="erro"> <h:message for="cnpj" /></span>
										</h:panelGroup>

										<h:outputLabel value="E-Mail : * " for="email"  style="font-weight:bold" />
										<h:panelGroup>
											<p:inputText id="email" label="e-mail"
												value="#{clienteBean.cliente.email}" size="30"
												maxLength="50" required="true"
												requiredMessage="Informe um endereço de email válido">
												<f:validateRegex
													pattern="[a-zA-Z0-9\-\_\.]+@[a-zA-Z0-9\-\_\.]+" />
													
											</p:inputText>
											<span id="erro"> <h:message for="email" /></span>
										</h:panelGroup>

										<!-- 										<h:outputLabel value="Telefone :" for="telefone" /> -->
										<!-- 										<p:inputMask value="1111111111" mask="(99) 9999-9999" -->
										<!-- 										required="true" -->
										<!-- 										requiredMessage="Informe um número de telefone" /> -->
									</h:panelGrid>
								</p:panel>
							</div>
						</div>

					</p:fieldset>
				</p:tab>

				<p:tab title="Endereco Cliente">
					<div id="cadastro">
						<div style="padding-left: 30px; float: left; margin-top: 10px;">


							<h:panelGrid columns="2">
								<h:outputLabel for="cep" value="Cep: *"  style="font-weight:bold" />
								<h:panelGroup>
									<p:inputMask id="cep" value="#{clienteBean.endereco.cep}"
										required="true" requiredMessage=" * Cep inválido"
										mask="99999-999" size="10" />
									<span id="erro"> <h:message for="cep" /></span>
								</h:panelGroup>

								<h:outputLabel for="logradouro" value="Logradouro : *"  style="font-weight:bold" />
								<h:panelGroup>
									<p:inputText id="logradouro" size="30" required="true"
										value="#{clienteBean.endereco.logradouro}" label="Logradouro" />
									<span id="erro"> <h:message for="logradouro" /></span>
								</h:panelGroup>

								<h:outputLabel for="numero" value="Número : *"  style="font-weight:bold" />
								<h:panelGroup>
									<p:inputMask mask = "?999999" id="numero" size="10"
										value="#{clienteBean.numero}" label="Numero">
									</p:inputMask>
									<span id="erro"> <h:message for="numero" />
									</span>
								</h:panelGroup>
								

								<h:outputLabel for="bairro" value="Bairro : *"  style="font-weight:bold" />
								<h:panelGroup>
									<p:inputText id="bairro" size="30" required="true"
										value="#{clienteBean.endereco.bairro}" label="bairro" />
									<span id="erro"> <h:message for="bairro" /></span>
								</h:panelGroup>

								<h:outputLabel for="cidade" value="Cidade : *"  style="font-weight:bold" />
								<h:panelGroup>
									<p:inputText id="cidade" size="30" required="true"
										value="#{clienteBean.endereco.cidade}" label="cidade" />
									<span id="erro"> <h:message for="cidade" /></span>
								</h:panelGroup>

								<h:outputLabel for="uf" value="UF : *"  style="font-weight:bold" />
								<h:panelGroup>
									<p:inputText id="uf" size="10" required="true"
										value="#{clienteBean.endereco.uf}" label="Uf" />
									<span id="erro"> <h:message for="uf" /></span>
								</h:panelGroup>
								
								<h:outputLabel for="complemento" value="Complemento : "  style="font-weight:bold" />
								<p:inputText id="complemento" size="20"
									value="#{clienteBean.endereco.complemento}" label="Complemento" />
							</h:panelGrid>
						</div>
					</div>
				</p:tab>
			</p:accordionPanel>
			<br></br>


			<h:panelGroup>
				<h:commandButton value="Salvar" action="#{clienteBean.salvar}"
					style="height: 30px;" />
			</h:panelGroup>
		</h:form>

	</ui:define>
</ui:composition>
</html>
